<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>已办列表</title>
    <script src="../../js/header.js"></script>
    <style type="text/css">
        html, body, #yiban {
            padding: 0px;
            margin: 0px;
            /*height: 100%;
            overflow: hidden;*/
        }

        #yiban {
            border-top: 3px solid #0D9AFF;
            /*background: #FFFFFF;
            box-shadow: 0px 2px 4px 0 rgba(200, 200, 200, 0.50);*/
            padding: 25px;
            /*background: url(../../images/bg.png) no-repeat;
            background-size: 100% 100%;*/
            /*background-attachment: fixed;*/
            /*overflow: hidden;*/
        }

        .tab-title {
            font-size: 16px;
            font-weight: bold;
            border-left: 4px solid #0D9AFF;
            font-family: PingFangSC-Medium;
            padding-left: 10px;
            margin-bottom: 20px;
        }

        .el-dialog__footer {
            padding: 10px 20px 20px;
            text-align: center;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }

        .el-dialog__body {
            color: rgb(96, 98, 102);
            font-size: 14px;
            word-break: break-all;
            padding: 0px 20px;
        }

        #excel {
            display: none;
        }

        .el-input__inner {
            -webkit-appearance: none;
            background-color: #FFF;
            background-image: none;
            border-radius: 4px;
            border: 1px solid #DCDFE6;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            color: #606266;
            display: inline-block;
            font-size: inherit;
            height: 30px;
            line-height: 30px;
            outline: 0;
            padding: 0 15px;
            -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
            transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
        }

        /*#yiban .el-input,
        #yiban .el-select,
        #yiban .el-input-number{
            width: 100%;
        }*/
        .listed .el-form-item__label {
            letter-spacing: 3px;
        }

        .el-textarea {
            width: 95%;
        }

        /* 搜索按钮样式修改 */
        #yiban .el-button.is-circle.search_btn {
            position: absolute;
            right: 0;
            top: 0;
            border: 0;
            background: none;
        }

        #yiban .el-button.is-circle.search_btn i {
            font-size: 17px;
        }

        .el-dialog.is-fullscreen {
            width: 100%;
            margin-top: 0;
            margin-bottom: 0;
            height: 100%;
            overflow-y: hidden;
        }
    </style>
</head>

<body>
<div v-cloak id="yiban">
    <div style="margin-top: 10px;">
        <div style="margin-top: 10px;border-bottom:1px solid rgba(200,200,200,0.43);">
            <el-form :model="selectForm" :rules="rules" ref="selectForm" label-width="150px">
                <el-row>
                    <el-col :span="10">
                        <el-form-item label="标题:" prop="" label-width="100px">
                            <el-input v-model="selectForm.title" placeholder=""></el-input>
                        </el-form-item>
                    </el-col>
                    <div style="float: right;">
                        <el-button type="primary" size="small" style="width: 60px;height: 30px;" @click="searchForm()">
                            查询
                        </el-button>
                        <el-button type="warning" size="small" style="width: 60px;height: 30px;"
                                   @click="resetForm('selectForm')">重置
                        </el-button>
                    </div>
                </el-row>
            </el-form>
        </div>

        <el-table :data="tableData" border style="margin-top: 35px;"
                  :header-cell-style="{background:'#eef1f6',color:'#606266'}">
            <!--<el-table-column type="selection"></el-table-column>-->
            <el-table-column
                    prop="title"
                    label="标题"
                    width="400"
                    align="center">
                <template slot-scope="{row}">
                    <el-link @click="cellClick(row,$event)">{{row.title}}</el-link>
                </template>
            </el-table-column>
            <el-table-column
                    prop="status"
                    label="状态"
                    width="180"
                    align="center">
                <template scope="scope">
                    <span v-if="scope.row.status==1" style="color:#F19437;">待办</span>
                    <span v-if="scope.row.status==2" style="color:#67C23A;">已办</span>
                </template>
            </el-table-column>
            <el-table-column
                    prop="createTime"
                    label="创建时间"
                    width="300"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="createPerson"
                    label="创建人"
                    width="250"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="location"
                    label="地址"
                    width=""
                    align="center">
            </el-table-column>
        </el-table>
        <div style="overflow: hidden;">
            <div class="pagination">
                <el-pagination
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                        :current-page="currentPage"
                        :page-sizes="[10, 20, 30, 40]"
                        :page-size="pagesize"
                        background
                        layout="total, sizes,prev, pager, next"
                        :total="tableTotal"
                        prev-text="上一页"
                        next-text="下一页">
                </el-pagination>
            </div>
        </div>
        <el-dialog title="" :visible.sync="genedialogForm" center fullscreen>
            <iframe id="genechildFrame" style="overflow:hidden;height:94vh;width:100%;" width="100%" frameBorder="0"
                    :src="linkurl"></iframe>
        </el-dialog>
        <el-dialog title="" :visible.sync="superdialogForm" center fullscreen>
            <iframe id="superchildFrame" style="overflow:hidden;height:94vh;width:100%;" width="100%" frameBorder="0"
                    :src="linkurl"></iframe>
        </el-dialog>
        <el-dialog title="" :visible.sync="apunitdialogForm" center fullscreen>
            <iframe id="apunitchildFrame" style="overflow:hidden;height:94vh;width:100%;" width="100%" frameBorder="0"
                    :src="linkurl"></iframe>
        </el-dialog>
        <el-dialog title="" :visible.sync="recorddialogForm" center fullscreen>
            <iframe id="recordchildFrame" style="overflow:hidden;height:94vh;width:100%;" width="100%" frameBorder="0"
                    :src="linkurl"></iframe>
        </el-dialog>
        <el-dialog title="" :visible.sync="commundialogForm" center fullscreen>
            <iframe id="communchildFrame" style="overflow:hidden;height:94vh;width:100%;" width="100%" frameBorder="0"
                    :src="linkurl"></iframe>
        </el-dialog>
        <el-dialog title="" :visible.sync="areadzdialogForm" center fullscreen>
            <iframe id="areadzdialogForm" style="overflow:hidden;height:94vh;width:100%;" width="100%" frameBorder="0"
                    :src="linkurl"></iframe>
        </el-dialog>
        <el-dialog title="" :visible.sync="publicdialogForm" center fullscreen>
            <iframe id="publicdialogForm" style="overflow:hidden;height:94vh;width:100%;" width="100%" frameBorder="0"
                    :src="linkurl"></iframe>
        </el-dialog>
    </div>
</div>
<script>
    var vm = new Vue({
        el: '#yiban',
        data() {
            return {
                currentPage: 1, //默认显示页面为1
                pagesize: 10, // 每页的数据条数
                tableTotal: '',
                genedialogForm: false,
                superdialogForm: false, // 开展监管项目
                apunitdialogForm: false, // 安评单位管理---审核
                recorddialogForm: false, // 安评工作备案--审核
                commundialogForm: false, //地震小区划工作--审核
                areadzdialogForm: false, //区域地震安全性工作--审核
                publicdialogForm: false, //公开公告--审核
                linkurl: '',
                selectForm: {
                    title: ''
                },
                companyInformation: [],
                currentRow: null,
                tableData: '',
            }
        },
        mounted() {
            this.getData();
        },
        methods: {
            getData() {
                var pagesize = this.pagesize;
                var pageno = this.currentPage - 1;
                axios({
                    method: 'get',
                    url: '/dzjap/todo/findtoworkPage',
                    params: {
                        pageSize: pagesize,
                        pageNo: pageno,
                        station: "项目审核员"
                    }
                })
                    .then(response => {
                        console.log(response);
                        let data = response.data;
                        if (data.code == 200) {
                            this.tableTotal = data.data.total;// 数据长度

                            this.tableData = data.data.results;
                            console.log(this.tableData)
                            // 修改日期格式
                            for (let i = 0; i < data.data.length; i++) {
                                this.tableData[i].createTime = this.tableData[i].createTime.toString().substr(0, 10);
                            }
                        } else {
                            this.$message.error(data.msg);
                        }
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            },
            /* 列表页搜索 */
            searchForm() {
                var pagesize = this.pagesize;
                var pageno = this.currentPage - 1;
                console.log(this.selectForm.title);
                axios({
                    method: 'get',
                    url: '/dzjap/todo/findtoworkPage',
                    params: {
                        pageSize: pagesize,
                        pageNo: pageno,
                        title: this.selectForm.title,
                        station: "项目审核员"
                    }
                })
                    .then(response => {
                        let data = response.data;
                        console.log(data);
                        if (data.code == 200) {
                            let dataInformation = data.data.results;
                            this.tableTotal = data.data.total;// 数据长度

                            this.tableData = dataInformation;
                        } else {
                            this.$message.error(data.msg);
                        }
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            },
            /* 列表页重置 */
            resetForm(formName) {
                this.selectForm.title = '';
                this.getData();
            },
            //每页下拉显示数据
            handleSizeChange(size) {
                this.pagesize = size;
                this.getData();
                /*console.log(this.pagesize) */
            },
            //点击第几页
            handleCurrentChange(currentPage) {
                this.currentPage = currentPage;
                this.getData();
            },
            cellClick(row, e) {
                console.log(row)
                console.log(row.url)
                console.log(row.status)
                console.log(row.linkId)
                // 一般工程抗震
                if (row.url == "../todolist/general.html") {
                    this.genedialogForm = true;
                    this.linkurl = row.url + '?linkId=' + row.linkId;
                }
                // 开展监管项目
                if (row.url == "../todolist/supervision.html") {
                    this.superdialogForm = true;
                    this.linkurl = row.url + '?linkId=' + row.linkId;
                }
                // 安评单位管理--审核
                if (row.url == "../todolist/apunit.html") {
                    this.apunitdialogForm = true;
                    this.linkurl = row.url + '?linkId=' + row.linkId;
                }
                // 地震小区划工作成果--审核
                if (row.url == "../todolist/commun.html") {
                    this.commundialogForm = true;
                    this.linkurl = row.url + '?linkId=' + row.linkId;
                }
                // 区域地震安全性工作成果--审核
                if (row.url == "../todolist/areadz.html") {
                    this.areadzdialogForm = true;
                    this.linkurl = row.url + '?linkId=' + row.linkId;
                }
                // 安评工作成果备案--审核
                if (row.url == "../todolist/prorecord.html") {
                    this.recorddialogForm = true;
                    this.linkurl = row.url + '?linkId=' + row.linkId;
                }

                if (row.url == "../todolist/publick.html") {
                    this.publicdialogForm = true;
                    this.linkurl = row.url + '?linkId=' + row.linkId + "&showApprovalBtn=2";
                }
            },
            // 一般工程抗震--审核关闭窗口
            generalCancel() {
                this.genedialogForm = false;
                this.getData();
            },
            // 开展监管关闭窗口
            superCancel() {
                this.superdialogForm = false;
                this.getData();
            },
            // 安评单位管理--审核关闭窗口
            apunitCancel() {
                this.apunitdialogForm = false;
                this.getData();
            },
            // 地震小区划工作成果--审核关闭窗口
            communCancel() {
                this.commundialogForm = false;
                this.getData();
            },
            // 区域地震工作成果--审核关闭窗口
            areadzCancel() {
                this.areadzdialogForm = false;
                this.getData();
            },
            // 安评工作备案成果--审核关闭窗口
            prorecordCancel() {
                this.recorddialogForm = false;
                this.getData();
            }
        }
    })
</script>
</body>
</html>